import { onMounted, onUnmounted, reactive } from "vue";

interface Scroll {
   left: number;
   top: number;
}

const useScroll = (): { scroll: Scroll } => {

   const scroll = reactive<Scroll>({ left: 0, top: 0 });

   const handleScroll = (): void => {
      scroll.left = Math.floor(document.documentElement.scrollLeft);
      scroll.top = Math.floor(document.documentElement.scrollTop);
   };

   onMounted((): void => {
      document.addEventListener("scroll", handleScroll);
   });

   onUnmounted((): void => {
      document.removeEventListener("scroll", handleScroll);
   });

   return {
      scroll,
   };
};


export default useScroll;
